<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>ComboBox - jQuery EasyUI Demo</title>
  <link rel="stylesheet" type="text/css" href="assets/combobox.css">
<script type="text/javascript" src="../common/jquery-1.6.2.min.js"></script>
  <script type="text/javascript" src="assets/jquery.easyui.min.js"></script>
</head>
<body>
  <h2>ComboBox</h2>
  <div class="demo-info">
    <div class="demo-tip icon-tip"></div>
    <div>Type in combobox to try auto complete.</div>
  </div>
  
  <div style="margin:10px 0;">
    <a href="#" class="easyui-linkbutton" onclick="getValue()">GetValue</a>
    <a href="#" class="easyui-linkbutton" onclick="disable()">Disable</a>
    <a href="#" class="easyui-linkbutton" onclick="enable()">Enable</a>
  </div>
  
  <p>Simple ComboBox: </p>
  <select id="cc" class="easyui-combobox" style="width:200px;" panelHeight="auto"></select>
  
  <script>
  var order = {albumstyle: '4'};
  var _self = this;
  var datas = [{
    "id":1,
    "text":"1",
    "value": 'x'
  },{
    "id":2,
    "text":"2",
    "value": 'xx'
  },{
    "id":3,
    "text":"3",
    "value": 'xxx'
  },{
    "id":4,
    "text":"4",
    "value": 'xxxx'
  },{
    "id":5,
    "text":"5",
    "value": 'xxxxx'
  }];
  var sel = document.getElementById('cc');
  
    function getValue(){
//      order.albumstyle= $('#cc').combobox('getValue');
order.albumstyle = $("#cc").find("option:selected").text();
      console.log(order.albumstyle);
    }
    function disable(){
      $('#cc').combobox('disable');
    }
    function enable(){
      $('#cc').combobox('enable');
    }
    
   
   for (var i = 0, il = datas.length; i < il; i++) {
     var obj = datas[i];
     op = new Option(obj.text);
     op.value = obj.id;
     if (order.albumstyle == obj.id) {
       op.selected = 'selected';
     }
     sel.options[sel.options.length] = op;
   }
   sel.onchange = function() { order.albumstyle = this.options[this.selectedIndex]._obj.value; };
  </script>
</body>
</html>